@define BACKGROUND_COLOR: #000000;

.EndScreenRoot
{
	width: 100%;
    height: 100%;
    background-color: gradient( linear, 0% 0%, 0% 100%, from( #000000FF ), color-stop( 0.12, #000000ff ), color-stop( 0.5, #00000022 ), to( #00000000 ) );
}

#VictoryRow
{
	flow-children: right;
    horizontal-align: right;
	margin-right: 8px;
	margin-bottom: 16px;

	transition-property: opacity, transform;
    transition-duration: 1s;
	opacity: 0;
	transform: scaleX(0) scaleY(0) translatey(-50px);
}

.endgame #VictoryRow
{
	opacity: 1;
	transform: scaleX(1) scaleY(1);
}

#WinningTeamLogo
{
	vertical-align: center;
	margin-right: 16px;
}

#EndScreenVictory
{
    font-size: 64px;
    color: #cccccc;
	vertical-align: center;

	text-transform: uppercase;
	margin-bottom: -16px;
}

.EndScreenWindow
{
    margin-top: 100px;
    margin-right: 200px;
    flow-children: down;
    horizontal-align: right;
	flow-children: down;
}

.AspectRatio4x3 .EndScreenWindow
{
    margin-right: 50px;
}

.EndScreenVictoryRow
{
	width: 100%;
}

#CloseButton
{
	background-color: #121618;
	border: 3px solid #4d5051;
    margin-top: 50px;
    horizontal-align: right;
	vertical-align: bottom;
	width: 200px;
}

#CloseButton:hover
{
	border: 3px solid white;
}

#CloseButton Label
{
    horizontal-align: center;
	vertical-align: center;
	color: #6f6f6f;
	text-transform: uppercase;
}

#CloseButton:hover Label
{
	color: white;
}

.FlyoutScoreboardRoot.flyout_scoreboard_visible
{
    transform: translatey( 0px );
}

#TeamsContainer
{
	horizontal-align: right;
    flow-children: down;
}

.FlyoutTeam
{
	margin-top: 3px;
	margin-bottom: 3px;

    transition-property: opacity, transform;
    transition-duration: 0.5s;
	opacity: 0;
	transform: translatey(-50px);
	
	margin-right: 8px;
}

.FlyoutTeam.local_player_team
{
}

.FlyoutTeam.team_endgame
{
	opacity: 1;
	transform: translatey(0px);
}

.FlyoutTeam.no_players
{
	visibility: collapse;
}

.FlyoutTeamData
{
    flow-children: right;
}

.TeamInfo
{
	margin-top: 1px;
	height: 100%;
}

#TeamColor_GradentFromTransparentLeft
{
	width: 100%;
	height: 100%;
}

.FlyoutPlayer
{ 
    flow-children: right;
}

.TeamCloseSpacer
{
}

#PlayersContainer
{
    flow-children: down;
}

.local_player_team #PlayersContainer
{
    box-shadow: fill #ffffff40 -3px -3px 3px 6px;
}

.TeamId
{
    flow-children: right;
}

#TeamLogo
{
	vertical-align: top;
	horizontal-align: right;
    height: 30px;
    width: 30px;
	margin-top: 2px;
	margin-right: 2px;
}

#TeamScorePanel
{
	margin-top: 1px;
	margin-left: 306px;
	width: 79px;
	height: 100%;
    background-color: BACKGROUND_COLOR;
}

#TeamScore
{
	vertical-align: center;
	horizontal-align: center;
	color: #cccccc;
	font-size: 42px;
	text-shadow: 2px 2px 2px black;
	font-weight: bold;
	margin-top: -2px;
}

.one_player #TeamScore
{
	font-size: 30px;
}

.local_player_team #TeamScore
{
	color: white;
}

.Legend
{
	flow-children: right;
	horizontal-align: right;
	margin-right: 8px;
}

.Legend Label
{
	text-transform: uppercase;
	font-size: 12px;
	color: #90999b;
}

.PlayerRow
{
	height: 32px;
}

#PlayerRowContainer
{
	flow-children: right;
	height: 32px;
}

#HeroIcon
{
    vertical-align: middle;
	border: 1px solid black;
}

#LevelContainer,
#KillsContainer,
#DeathsContainer,
#AssistsContainer
{
	height: 100%;
}

.ScoreboardPanel
{
    background-color: BACKGROUND_COLOR;
	margin-top: 1px;
	margin-left: 1px;
	height: 100%;
}

.LegendPanel
{
	margin-top: 1px;
	margin-left: 1px;
}

.ScoreboardPanel Label
{
	font-size: 30px;
	text-shadow: 2px 2px 2px black;
	margin-top: -2px;
}

.UltimateIndicatorShared
{
	margin-left: 44px;
	margin-top: 2px;
	vertical-align: center;
	width: 20px;
	height: 20px;
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

#Level
{
	vertical-align: middle;
	horizontal-align: center;
	color: #898b8c;
}

#Kills,
#Deaths,
#Assists,
#PlayerGoldAmount
{
	horizontal-align: center;
	vertical-align: center;
	text-align: center;
	font-size: 20px;
	margin-top: 3px;
}

#PlayerGoldAmount
{
}

#PlayerName
{
	font-size: 14px;
	font-weight: bold;
	margin-bottom: -4px;
	margin-top: 0px;
	padding-left: 4px;
	color: #cccccc;
	white-space: nowrap;
}

#HeroNameAndDescription
{
	padding-left: 4px;
	font-size: 13px;
	text-shadow: 2px 2px 2px black;
	margin-top: 0px;
	color: #999999;
	vertical-align: bottom;
}

#PlayerDetailsContainer
{
	height: 100%;
}

#PlayerAndHeroName
{
	height: 100%;
}

#PlayerItemsContainer
{
	flow-children: right;
}

#PlayerItemsContainer Image
{
	margin: 1px;
	width: 41px;
	height: 30px;
	background-color: BACKGROUND_COLOR;
}



.is_local_player Label
{
	color: white;
}

.ScoreCol_TeamInfo
{
	width: 80px;
}

.ScoreCol_PlayerDetails
{
	width: 170px;
}

.ScoreCol_TeamScore
{
	width: 80px;
	text-align: center;
}

.ScoreCol_Hero
{
	width: 53px;
}

.ScoreCol_Level
{
	width: 50px;
	text-align: center;
}

.ScoreCol_Kills,
.ScoreCol_Deaths,
.ScoreCol_Assists
{
	width: 50px;
	text-align: center;
}

.ScoreCol_Items
{
	width: 258px;
	text-align: center;
}

.ScoreCol_Gold
{
	width: 70px;
	text-align: center;
}
